<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui"
	template="template.xhtml">
	
	<ui:define name="head">
		<style type="text/css">
			.label {
				width:18%;
				padding:1px;
			}

			.value {
				width:80%;
				padding:1px;
			}
			.grid {
				width:100%;
			}
		</style>
	</ui:define>
	
	
	<ui:define name="content">
		
		<h:form prependId="false">
			
			<p:panel id="panel" header="Create new Vehicle">
				<p:messages id="msgs" showDetail="true"/> 
				<h:panelGrid columns="2" columnClasses="label,value" styleClass="grid">
					<h:outputLabel for="title" value="Vehicle Reg. No:" />
					<p:inputText id="title" value="#{createVehicle.vehicle.vehCharRegno}" required="true"
					 requiredMessage="Vehicle No is mandatory" validatorMessage="Max length is 10">
						<f:validateLength maximum="10" />
					</p:inputText>
					
					
					<h:outputLabel for="make" value="Vehicle Make:" />
					 <p:selectOneMenu id="make" value="#{createVehicle.vehicle.vehCharMake}" required="true">  
                		<f:selectItem itemLabel="Select One" itemValue="" />  
                		<f:selectItem itemLabel="TATA" itemValue="TATA" />
						<f:selectItem itemLabel="ASHOK LEYLAND" itemValue="ASHOK LEYLAND" />
            		</p:selectOneMenu>  
            		
            		
					<h:outputLabel for="model" value="Vehicle Model:" />
					<p:inputText id="model" value="#{createVehicle.vehicle.vehCharModel}" required="true"
					 requiredMessage="Vehicle model mandatory" validatorMessage="Max length is 50">
						<f:validateLength maximum="50" />
					</p:inputText>
					 
					
					<h:outputLabel for="owner" value="Vehicle Owner:" />
					<p:inputText id="owner" value="#{createVehicle.vehicle.vehCharOwner}" required="true"
					 requiredMessage="Vehicle Owner mandatory" validatorMessage="Max length is 60">
						<f:validateLength maximum="60" />
					</p:inputText>
					 
					
					<h:outputLabel for="insurance" value="Vehicle Insurance:" />
					<p:inputText id="insurance" value="#{createVehicle.vehicle.vehCharInsurance}"  validatorMessage="Max length is 60">
						<f:validateLength maximum="60" />
					</p:inputText>
										
					
					<h:outputLabel for="registrtionDate" value="Vehicle Registration Date:" />
					<p:calendar id="registrtionDate" value="#{createVehicle.vehicle.vehDateRegdate}" required="true"
					showOn="button" />  
					
					
					<h:outputLabel for="insuranceExpiryDate" value="Vehicle Insurance Expiry Date:" />
					<p:calendar id="insuranceExpiryDate" value="#{createVehicle.vehicle.vehDateInsurexpiry}" required="true"
					showOn="button" pattern="EEE, dd MMM, yyyy" showButtonPanel="true" navigator="true" requiredMessage="Vehicle insurance Exp Date is mandatory"  />  
					
					
					<h:outputText />
					<h:panelGroup>
						<h:panelGrid columns="2">
							<p:commandButton value="Reset" type="reset" />
							<p:commandButton id="save" value="Save" 
							async="true" update="panel" actionListener="#{createVehicle.save}"/>
							
							<p:confirmDialog id="confirmDialog"
								message="Please check the DL No Properly before save,DL No cannot be modified later..!!!"
								header="Initiating Vechile Save process" severity="alert" fixedCenter="true" draggable="false"
								widgetVar="confirmation">

								<p:commandButton id="confirm" value="Yes Sure" update="msgs"
									oncomplete="confirmation.hide();"
									actionListener="#{createVehicle.save}" />
								<p:commandButton id="decline" value="Not Yet"
									onclick="confirmation.hide();" type="button" />

							</p:confirmDialog>
							
							
						</h:panelGrid>
						
						
					</h:panelGroup>
					
				</h:panelGrid>
			</p:panel>

			
		</h:form>
		
  </ui:define>
  
</ui:composition>